require("../../assets/css/basic.less");
require("../../assets/css/normalize.css");
require("../../assets/css/property.css");
require("../../assets/css/reset.css");
require("../../assets/fonts/font-icon/iconfont.css");
require("../course/course.less");
const dom = require("../../libs/dom.js");
const utils = require("../../libs/utils");
const axios = require("../../libs/axios.js");

document.addEventListener("DOMContentLoaded", function () {
	// 添加顶部导航
	utils.movementTopNav(".app-movement", 2);
	// 添加页脚导航
	utils.footerPlugin(1);

	// 获取课程列表,渲染到页面上
	axios.get("/api/train/courseList").then((res) => {
		let data = res.data.data;
		console.log(data);
		let newCourse = data.shift(); //删除头部第一个元素并返回

		// 渲染最新课程
		dom.get("#newCourse img").src = axios.defaults.baseURL + newCourse.imgurl;
		dom.get("#newCourse h3").textContent = newCourse.name;
		dom.get("#newCourse p").textContent = newCourse.desc.slice(0, 18) + "...";
		dom.get(".item a").href = "course_details.html?id=" + newCourse.courseId;

		//渲染课程列表
		let html = "";
		data.forEach((v) => {
			html += `
				 <li>
					 <a href="course_details.html?id=${v.courseId}">
						 <img src="${axios.defaults.baseURL + v.imgurl}">
						 <h4>${v.name}</h4>
						 <p>${v.desc.slice(0, 18)}</p>
					 </a>
				 </li>
			 `;
		});

		dom.get(".item ul").innerHTML = html;
	});
});
